<!-- 逻辑代码 写 函数 定义数据
  setup：用 Vue 提供的一种【语法糖】，简化的写法
  lang="ts" 内部写的语言：TypeScript
-->
<script setup lang="ts">
// 1. 定义数据 任意类型都可以
const food = '西兰花炒蛋'

const cat = {
  name: '喵喵',
  food: '鱼',
  color:'黄白色'
  }
</script>

<!-- 结构 -->
<template>
 <h1>么么哒：{{ food }}</h1>
 <p>{{ cat }}</p>
 <p>{{ cat.food }}</p>
</template>


<!-- 样式 -->
<style scoped>
h1{
  color:orange;
}
p{
  background-color: skyblue;
}

</style>
